@themeColor: #999;

.background(){
  background-size: cover;
  background-position: left;
  background-repeat: no-repeat;
  background-image: url('https://open.saintic.com/api/bingPic/');
}

/**
 * ============================
 *            全局动画
 * ============================
 */
:global {
  // ❤ 心跳
  .heartbeat {
    :local {
      animation: heartbeat 1300ms ease 0s infinite normal;
    }
  }
  // 上下浮动
  .jobalert {
    :local {
      animation-name: jobalert;
      animation-duration: 2s;
      animation-direction: alternate;
      animation-iteration-count: infinite;
    }
  }

  .opacity {
    :local {
      animation-name: opacity;
      animation-duration: 2s;
      animation-iteration-count: infinite;
    }
  }
}

@keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.3);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.3);
  }
  70% {
    transform: scale(1);
  }
}

@keyframes jobalert {
  from {
    transform: translate3d(0, -10px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes opacity {
  0%, 100% {
    opacity: .3;
  }
  50% {
    opacity: 1;
  }
}

